<script>
  import { base, assets } from "$app/paths";
  import { onMount } from 'svelte';
  let grid_row=80;
  let grid_col=72;//24 or 48 or 72

  let mycanvas ;

  onMount(async () => {
	  let ctx = mycanvas.getContext("2d");
    ctx.fillStyle = "#FF0000";
    ctx.fillRect(20,20,150,75);
	});

</script>

<div class="flex items-center justify-center w-full flex-col p-4">
  <div class="grid {grid_col == 24 ? 'grid-cols-24': grid_col==48?'grid-cols-48':'grid-cols-72'} border border-solid border-gray-400 w-full">
    <div
      class="row-span-full col-start-1 {grid_col==24?'col-span-24':grid_col==48?'col-span-48':'col-span-72'} self-center 
      grid {grid_col == 24 ? 'grid-cols-24': grid_col==48?'grid-cols-48':'grid-cols-72'}"
    >
      {#each Array(grid_row) as __, row}
        <div class=" border-b border-solid border-gray-400 {row%2==0?'bg-gray-200':'bg-blue-200'} h-6 text-xs text-center inline-block align-middle">{row+1}</div>
        {#each Array(grid_col-1) as __, col}
          <div class=" border-b border-solid border-gray-400 {row%2==0 ? col%2==0?'bg-blue-200':'bg-gray-200':col%2==0?'bg-gray-200':'bg-blue-200' } h-6 text-xs text-center inline-block align-middle">{col+2}</div>
        {/each}
      {/each} 
    </div>

    <div class="row-span-full {grid_col==24?'col-start-2 col-span-22':grid_col==48?'col-start-3 col-span-44':'col-start-4 col-span-66'}  self-start 
    grid grid-cols-22 border-x border-solid border-gray-400" >

      <div class="row-start-1 col-span-22 bg-purple-300 bg-transparent h-6 border-b border-solid border-gray-400">  &nbsp;</div>
        <!--Part 1-->
      <div
          class="row-start-2 col-span-5 bg-gray-300 h-12 border-b border-solid border-gray-400"
        >
          <span class="text-lg font-bold">AMER. EXPRESS</span>
          <span class="text-lg font-bold">NYSE-AXP</span>
      </div>
      <div
          class="row-start-2 col-span-4 border-x border-b border-solid border-gray-400 flex flex-row bg-gray-300  h-12"
      >
          <span class="text-lg font-bold whitespace-wrap pr-2"> RECENT PRICE </span>
          <span class="text-lg">158.93</span>
      </div>
      <div
          class="row-start-2 col-span-3 bg-gray-300 h-12 flex flex-wrap  border-b border-solid border-gray-400"
      >
          <span class="text-lg font-bold whitespace-wrap pr-2">P/E RATIO</span>
          <span class="text-lg">15.7</span>
          <span class="text-xs"> (<b>Trailing</b>: 16.6 <b>Median</b>: 14.0) </span>
      </div>
      <div
          class="row-start-2 col-span-4 border-x  border-b border-solid border-gray-400 bg-gray-300  h-12 "
        >
          <span class="text-lg font-bold whitespace-wrap pr-2">RELATIVE P/E RATIO</span>
          <span class="text-lg">0.85</span>
      </div>
      <div
          class="row-start-2 col-span-3 bg-gray-300  h-12 border-r  border-b border-solid border-gray-400 "
        >
          <span class="text-lg font-bold whitespace-wrap pr-2">DIV'D YLD </span>
          <span class="text-lg"> 1.3% </span>
      </div>
      <div
          class="row-start-2 col-span-3  bg-red-800 h-12 text-center  border-b border-solid border-gray-400"
        >
        <span class="text-white text-lg font-bold pr-2">VALINE</span>
        
      </div>

      <div class="row-start-3 row-span-4 col-span-4 bg-gray-300 grid grid-flow-row grid-cols-3 ">

        <div class="border-r border-b border-solid border-gray-400 text-sm font-bold h-6 bg-blue-200 pr-2">1.TIMELINESS</div> <div  class="pl-2 bg-blue-200 col-span-2 h-6 border-b border-solid border-gray-400 text-sm"><b>2</b> Lowered 5/14/21</div> 
        <div class="border-r border-b border-solid border-gray-400 text-sm font-bold h-6 bg-gray-200 pr-2">2.SAFETY</div>     <div  class="pl-2 bg-gray-200 col-span-2 h-6 border-b border-solid border-gray-400 text-sm"><b>1</b> Raised 8/14/15</div> 
        <div class="border-r border-b border-solid border-gray-400 text-sm           h-6 bg-blue-200 pr-2">3.TECHNICAL</div>  <div  class="pl-2 bg-blue-200 col-span-2 h-6 border-b border-solid border-gray-400 text-sm"><b>3</b> Lowered 1/21/22</div> 
        <div class="border-r border-b border-solid border-gray-400 text-sm font-bold h-6 bg-gray-200 pr-2">4.BETA</div>       <div  class="pl-2 bg-gray-200 col-span-2 h-6 border-b border-solid border-gray-400 text-sm"><b>1.30</b>(1.00 = Market)</div> 
        
      </div>
  
      <div class="row-start-3 col-start-5 row-span-2 col-span-18 bg-gray-300 grid grid-flow-row grid-cols-18 border-solid border-l border-gray-400 ">
          <div class="h-6 px-2 text-sm font-bold bg-blue-200 border-b border-solid border-gray-400">1.High:</div>
          {#each Array(14) as _, i}
            <div class="text-sm h-6 bg-blue-200 border-b border-solid border-gray-400">30</div>   
          {/each}
          <div class="col-span-3 text-sm font-bold bg-blue-200 border-b border-solid border-gray-400">Target Price Range</div>
          <div class="h-6 px-2 text-sm font-bold bg-gray-200 border-b border-solid border-gray-400">2.Low:</div>
          {#each Array(14) as _, i}
            <div class="text-sm h-6 bg-gray-200 border-b border-solid border-gray-400">12</div>   
          {/each}
          <div class="text-sm font-bold bg-gray-200 h-6 border-b border-solid border-gray-400">2024</div>
          <div class="text-sm font-bold bg-gray-200 h-6 border-b border-solid border-gray-400">2025</div>
          <div class="text-sm font-bold bg-gray-200 h-6 border-b border-solid border-gray-400">2026</div>
      </div>
      <div class="row-start-5 col-start-5 row-span-15 col-span-18 bg-green-200  border-b border-solid border-gray-400">

        <div class="w-full h-full relative p-1">
          <div class="absolute bottom-1 left-1 bg-gray-300 grid grid-flow-row grid-cols-2 border-0 border-solid border-gray-400 w-32">
            <div class="row-span-3 px-2 pt-2 text-sm font-bold whitespace-normal">Percent shares traded L</div>   
            <div class="text-sm h-4 pl-2">30</div>     
            <div class="text-sm h-4 pl-2">20</div>     
            <div class="text-sm h-4 pl-2">10 </div>     
          </div>

          <div class="absolute right-16 bottom-1 bg-gray-300 grid grid-flow-row grid-cols-2 border-0 border-solid border-gray-400">
            <div class="h-6 col-span-2 pl-2 pt-2  font-bold px-2 text-sm">% TOT. RETURN 12/21 </div>  
            <div class="h-6 text-sm font-bold border-r border-solid border-gray-400 text-right ">this stock</div><div class="text-sm font-bold">VL* Index</div>
            <div class="h-4 text-sm font-bold pl-2 border-r border-solid border-gray-400 "><b>1 yr.</b> 36.9 </div><div class="h-4 text-sm pl-2">25.4</div>
            <div class="h-4 text-sm font-bold pl-2 border-r border-solid border-gray-400 "><b>3 yr.</b> 78.7 </div><div class="h-4 text-sm pl-2">84.2</div>
            <div class="h-4 text-sm font-bold pl-2 border-r border-solid border-gray-400 "><b>5 yr.</b> 137.0</div><div class="h-4 text-sm pl-2">88.5</div>
          </div>

          <canvas id="mycanvas" bind:this={mycanvas} class="h-88 w-full border-separate border-8 border-blue-800"></canvas>
          
        </div>
      </div>

      <div class="row-start-7 row-span-3 col-span-4 bg-gray-300 grid grid-flow-row grid-cols-2 ">
        <div class="col-span-2 text-sm font-bold h-6 bg-blue-200  border-b border-solid border-gray-400">5.18-Month Target Price Range</div> 
        <div class="border-r border-b border-solid border-gray-400 font-bold text-sm h-6 bg-gray-200">6.Low-High</div>     <div  class="font-bold text-sm bg-gray-200 h-6 border-b border-solid border-gray-400">Midpoint (% to Mid)</div> 
        <div class="border-r border-b border-solid border-gray-400  text-sm h-6 bg-blue-200">7.$126-$243</div>             <div  class="text-sm bg-blue-200 h-6 border-b border-solid border-gray-400">$185 (15%)</div> 
      </div>

        
      <div class="row-start-10 row-span-5 col-span-4 bg-gray-300 grid grid-flow-row grid-cols-4 ">
        <div class="col-span-4 text-sm font-bold  h-6 bg-gray-200 border-b border-solid border-gray-400">8.2024-26 PROJECTIONS</div> 
        <div class="text-sm h-6 bg-blue-200 border-b border-solid border-gray-400">9.</div>     <div  class="border-b border-solid border-gray-400 bg-blue-200 h-6"></div> <div  class="border-b border-solid border-gray-400 bg-blue-200 h-6"></div><div  class="border-b border-solid border-gray-400 font-bold text-sm bg-blue-200 h-6">Ann’l/T </div>  
        <div class="text-sm h-6 bg-gray-200 border-b border-solid border-gray-400">10.</div>     <div  class="border-b border-solid border-gray-400 font-bold text-sm bg-gray-200 h-6">Price</div> <div  class="border-b border-solid border-gray-400 font-bold text-sm bg-gray-200 h-6">Gain</div><div  class="border-b border-solid border-gray-400 font-bold text-sm bg-gray-200 h-6">Return</div>  
        <div class="text-sm font-bold h-6 bg-blue-200 border-b border-solid border-gray-400">11.High</div>  <div  class="border-b border-solid border-gray-400 bg-blue-200 h-6 text-sm">225</div> <div  class="border-b border-solid border-gray-400 bg-blue-200 h-6 text-sm">(+40%)</div><div  class="border-b border-solid border-gray-400 bg-blue-200 h-6 text-sm">10%</div>
        <div class="text-sm font-bold h-6 bg-gray-200 border-b border-solid border-gray-400">12.Low</div>    <div  class="border-b border-solid border-gray-400 bg-gray-200 h-6 text-sm">185</div> <div  class="border-b border-solid border-gray-400 bg-gray-200 h-6 text-sm">(+15%)</div><div  class="border-b border-solid border-gray-400 bg-gray-200 h-6 text-sm">5%</div>
      </div>

      <div class="row-start-15 row-span-5 col-span-4 bg-gray-300 grid grid-flow-row grid-cols-4 ">
        <div class=" border-b border-solid border-gray-400 col-span-4 text-sm font-bold h-6 bg-blue-200">13.Institutional Decisions</div> 
        <div class=" border-b border-solid border-gray-400 text-sm h-6 bg-gray-200">14.</div>     <div  class="border-b border-solid border-gray-400 font-bold text-sm bg-gray-200 h-6">1Q2021</div> <div  class="border-b border-solid border-gray-400 font-bold text-sm bg-gray-200 h-6">2Q2021</div><div  class="border-b border-solid border-gray-400 font-bold text-sm bg-gray-200 h-6">3Q2021 </div>  
        <div class=" border-b border-solid border-gray-400 text-sm font-bold h-6 bg-gray-200">15.to Buy</div>  <div  class="border-b border-solid border-gray-400 text-sm bg-gray-200 h-6">719</div> <div  class="border-b border-solid border-gray-400 text-sm bg-gray-200 h-6">746</div><div  class="border-b border-solid border-gray-400 text-sm bg-gray-200 h-6">758</div>
        <div class=" border-b border-solid border-gray-400 text-sm font-semibold h-6 bg-blue-200">16.to Sell</div>    <div  class="border-b border-solid border-gray-400 text-sm bg-blue-200 h-6">802</div> <div  class="border-b border-solid border-gray-400 text-sm bg-blue-200 h-6">747</div><div  class="border-b border-solid border-gray-400 text-sm bg-blue-200 h-6">753</div>
        <div class=" border-b border-solid border-gray-400 text-sm font-semibold h-6 bg-gray-200">17.Hld’s (000)</div>    <div  class="border-b border-solid border-gray-400 text-sm bg-gray-200 h-6">677422</div> <div  class="border-b border-solid border-gray-400 text-sm bg-gray-200 h-6">676377</div><div  class="border-b border-solid border-gray-400 text-sm bg-gray-200 h-6">662550</div>
      </div>
    
       
       
      {#each Array(18) as __, i}
        <div class=" row-start-20 border-b border-r border-solid border-gray-400 bg-gray-300 text-sm ">{2005+i}</div>
      {/each}
      <div class=" row-start-20 border-b border-r border-solid border-gray-400 bg-gray-300 col-span-3 text-sm font-bold">© VALUE LINE PUB. LLC </div>
      <div class=" row-start-20 border-b border-0 border-solid border-gray-400 bg-gray-300 h-6 px-2 text-sm font-bold">24-26</div> 

               
      {#each Array(18) as __, i}
        <div class=" row-start-21 border-b border-r border-solid border-gray-400 bg-gray-300 text-sm">{2005+i}</div>
      {/each}
      <div class=" row-start-21 border-b border-r border-solid border-gray-400 bg-gray-300 col-span-3 text-sm font-bold">Earnings per sh A </div>
      <div class=" row-start-21 border-b border-0 border-solid border-gray-400 bg-gray-300 h-6 px-2 text-sm font-bold">12.85</div> 

              
      {#each Array(18) as __, i}
        <div class=" row-start-22 border-b border-r border-solid border-gray-400 bg-gray-300 text-sm">{2105+i}</div>
      {/each}
      <div class=" row-start-22 border-b border-r border-solid border-gray-400 bg-gray-300 col-span-3 text-sm font-bold">Div’ds Decl’d per sh B■ </div>
      <div class=" row-start-22 border-b border-0 border-solid border-gray-400 bg-gray-300 h-6 px-2 text-sm font-bold">12.85</div> 
    
      {#each Array(18) as __, i}
        <div class=" row-start-23 border-b border-r border-solid border-gray-400 bg-gray-300 text-sm">{2205+i}</div>
      {/each}
      <div class=" row-start-23 border-b border-r border-solid border-gray-400 bg-gray-300 col-span-3 text-sm font-bold">Book Value per sh </div>
      <div class=" row-start-23 border-b border-0 border-solid border-gray-400 bg-gray-300 h-6 px-2 text-sm font-bold">12.85</div> 
      
      {#each Array(18) as __, i}
        <div class=" row-start-24 border-b border-r border-solid border-gray-400 bg-gray-300 text-sm">{2305+i}</div>
      {/each}
      <div class=" row-start-24 border-b border-r border-solid border-gray-400 bg-gray-300 col-span-3 text-sm font-bold">Common Shs Outst’g C </div>
      <div class=" row-start-24 border-b border-0 border-solid border-gray-400 bg-gray-300 h-6 px-2 text-sm font-bold">12.85</div> 

      {#each Array(18) as __, i}
        <div class=" row-start-25 border-b border-r border-solid border-gray-400 bg-gray-300 text-sm">{2405+i}</div>
      {/each}
      <div class=" row-start-25 border-b border-r border-solid border-gray-400 bg-gray-300 col-span-3 text-sm font-bold"> Avg Ann’l P/E Ratio </div>
      <div class=" row-start-25 border-b border-0 border-solid border-gray-400 bg-gray-300 h-6 px-2 text-sm font-bold">12.85</div> 
      
    
      {#each Array(18) as __, i}
        <div class=" row-start-26 border-b border-r border-solid border-gray-400 bg-gray-300 text-sm">{2505+i}</div>
      {/each}
      <div class=" row-start-26 border-b border-r border-solid border-gray-400 bg-gray-300 col-span-3 text-sm font-bold"> Relative P/E Ratio</div>
      <div class=" row-start-26 border-b border-0 border-solid border-gray-400 bg-gray-300 h-6 px-2 text-sm font-bold">12.85</div> 
    
      {#each Array(18) as __, i}
        <div class=" row-start-27 border-b border-r border-solid border-gray-400 bg-gray-300 text-sm">{2605+i}</div>
      {/each}
      <div class=" row-start-27 border-b border-r border-solid border-gray-400 bg-gray-300 col-span-3 text-sm font-bold"> Avg Ann’l Div’d Yield</div>
      <div class=" row-start-27 border-b border-0 border-solid border-gray-400 bg-gray-300 h-6 px-2 text-sm font-bold">12.85</div> 
       
      <div class="row-start-28 col-span-22 grid grid-flow-row grid-cols-22 bg-purple-200">
        <div class="col-span-6 border-r border-b border-solid border-gray-400 h-full flex flex-col"> 
          <div class="bg-gray-300 text-sm">
            CAPITAL STRUCTURE as of 12/31/21<br>
            ST Debt $2000 mill. Due in 5 Yrs $30000 mill.<br>
            LT Debt $39000 mill. LT Interest $835 mill.<br>
            (Total interest coverage ’20: 4.7x)<br>
            (64% of Cap’l)<br>
            No Defined Benefit Pension Plan<br>
            Leases, Uncapitalized Annuals rentals $141 mill.<br>
            Pfd Stock Series B & C: $1.6 bill. Div’d $61 mill.<br>
            Common Stock 761,000,000 shs.<br>
            MARKET CAP: $121 billion (Large Cap) <br>
          </div>
          <div class="bg-red-300 text-sm">
            block 2 <br>block 2 <br> block 2 <br> block 2 <br> block 2 <br> block 2 <br> block 2 <br>  
          </div>
          <div class="bg-gray-300 text-sm">
            block 3 <br>block 2 <br> block 2 <br> block 2 <br> block 2 <br> block 2 <br> block 2 <br>  
          </div>
          
          <div class="bg-red-300 text-sm">
            block 4 <br>block 2 <br> block 2 <br> block 2 <br> block 2 <br> block 2 <br> block 2 <br>  
          </div>
          <div class="bg-gray-300 text-sm">
            block 5 <br>block 2 <br> block 2 <br> block 2 <br> block 2 <br> block 2 <br> block 2 <br>  
          </div>
          <div class="bg-red-300 text-sm h-full">
            block 6 <br>block 6 <br> block 6 <br> block 6 <br> block 6 <br> block 6 <br> block 6 <br>  
          </div>
        </div>
        <div class="col-span-16 grid grid-cols-16 grid-flow-row border-b border-solid border-gray-400 ">
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> Total Assets ($mill) </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
            
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> Loans ($mill)  </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
              
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> Net Interest Inc ($mill)  </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
              
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm">Loan Loss Prov’n ($mill) E</div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
              
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> Noninterest Inc ($mill) </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
              
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> Noninterest Exp ($mill) </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
              
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> Net Profit ($mill)  </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
              
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> Income Tax Rate </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
              
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> Return on Total Assets </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
              
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> Long-Term Debt ($mill) </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
              
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> Shr. Equity ($mill) </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
              
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> Shr. Eq. to Total Asset </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
              
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> Loans to Tot Assets </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
              
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> Return on Shr. Equity </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
              
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> Retained to Com Eq </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
              
              {#each Array(12) as _, i} <div class="border-r border-b border-solid border-gray-400 h-6 text-sm">{i+1}</div> {/each}
              <div class="col-span-3 border-r border-b border-solid border-gray-400 h-6 text-sm"> All Div’ds to Net Prof </div> <div class=" border-b border-solid border-gray-400  h-6 text-sm"> 20000 </div>
                
              <div class="col-span-16 bg-blue-300 text-sm"> 
                <b>BUSINESS</b>: 标签定义图形，比如图表和其他图像，您必须使用脚本来绘制图形。 在画布上（Canvas）画一个红色矩形，渐变矩形，彩色矩形，和一些彩色的文字
                <b>BUSINESS</b>: American Express Company is a leading global payments, network, and travel firm established in 1850 and incorporated in 1965. Is a world leader in providing charge and credit
                cards. Operates via four reportable operating segments: U.S. Consumer Services, International Consumer and Network Services,
                Global Commercial Services, and Global Merchant Services. Had
                approximately 63,700 employees at 12/31/20. Off./dir. own less
                than 1.0% of the company’s common stock; Berkshire Hathaway,
                18.9%; The Vanguard Group, 5.8%; BlackRock, 5.8%; Wellington
                Inv., 5.2% (4/21 Proxy). Chairman & CEO: Stephen J. Squeri. Inc.:
                New York. Address: 200 Vesey Street, New York, New York 10285.
                Telephone: 212-640-2000. Web: www.americanexpress.com.<b>BUSINESS</b>: American Express Company is a leading global payments, network, and travel firm established in 1850 and incorporated in 1965. Is a world leader in providing charge and credit
                cards. Operates via four reportable operating segments: U.S. Consumer Services, International Consumer and Network Services,
                Global Commercial Services, and Global Merchant Services. Had
                approximately 63,700 employees at 12/31/20. Off./dir. own less
                than 1.0% of the company’s common stock; Berkshire Hathaway,
                18.9%; The Vanguard Group, 5.8%; BlackRock, 5.8%; Wellington
                Inv., 5.2% (4/21 Proxy). Chairman & CEO: Stephen J. Squeri. Inc.:
                New York. Address: 200 Vesey Street, New York, New York 10285.
                Telephone: 212-640-2000. Web: www.americanexpress.com.  <b>BUSINESS</b>: American Express Company is a leading global payments, network, and travel firm established in 1850 and incorporated in 1965. Is a world leader in providing charge and credit
                cards. Operates via four reportable operating segments: U.S. Consumer Services, International Consumer and Network Services,
                Global Commercial Services, and Global Merchant Services. Had
                approximately 63,700 employees at 12/31/20. Off./dir. own less
                than 1.0% of the company’s common stock; Berkshire Hathaway,
                18.9%; The Vanguard Group, 5.8%; BlackRock, 5.8%; Wellington
                Inv., 5.2% (4/21 Proxy). Chairman & CEO: Stephen J. Squeri. Inc.:
                New York. Address: 200 Vesey Street, New York, New York 10285.
                Telephone: 212-640-2000. Web: www.americanexpress.com. 
              </div>
              <div class="col-span-16 bg-purple-300 text-sm"> 
                <b>American Express</b> stands to post better results in 2022. That depends heavily, of course, on the global economic situation, which we expect to improve, assuming that the coronavirus becomes less of a
                problem in the months ahead. Consequently, there ought to be a rise in the
                number of cards outstanding, higher card
                member spending levels, plus greater标签定义图形，比如图表和其他图像，您必须使用脚本来绘制图形。 在画布上（Canvas）画一个红色矩形，渐变矩形，彩色矩形，和一些彩色的文字
                travel and leisure outlays by consumers.
                It’s also important to mention that strategic investments that have been made to
                attract new Millennial and Gen Z customers and expand the company’s leadership
                position with small businesses continue to
                bear fruit. There will probably be a provision for credit losses, unlike last year’s unusual provision for recovery of credit
                losses. Even so, at this juncture, we look
                for 2022 earnings per share to advance
                around 7%, to $10.75, compared to the
                prior-year total of $10.02. The bottom line
                might increase at a similar percentage
                rate in 2023, to $11.50 a share, as operating margins widen further.
                The Financial Strength rating is impressive, at A++. When the fourth
                quarter of 2021 concluded, cash and equivalents were a whopping $22 billion. What’s
                more, American Express holds a $3.5 billion bank credit facility expiring in October, 2024. Although short-term borrowings
                amounted to a reasonable $2 billion at the
                end of December, long-term debt was on
                the heavy side, at around 64% of total capital. Nonetheless, the company should be
                able to meet its various obligations for
                quite a while.
                Good things appear to be in store over
                the 2024-2026 horizon. American Express is one of the world’s largest issuers
                of credit and charge cards. Consider, also,
                the affluent client base. Another plus is
                new products, such as a fully digital business checking account designed for small
                and mid-sized companies. Lastly, acquisitions are plausible, supported, of course,
                by the strong balance sheet.
                The Dow-30 stock should appeal to
                some investors. It is well ranked for both
                Timeliness and Safety. Dividend growth
                prospects sweeten the pot. However, the
                equity’s long-term capital appreciation
                potential looks unimpressive, compared to
                the Value Line median.
                Frederick L. Harris, III February 4, 2022

              </div>
            </div>
      </div>

      <div class="row-start-29 col-span-17 bg-blue-300 flex flex-row"> 
        <div class="text-xs border-r border-solid border-gray-400 pr-2"><span class="text-xs font-semibold pr-1 ">(1)</span>footer leffooter leftfooter leftfooter leftfooter leftfooter leftfooter leftt 1</div> 
        <div class="text-xs border-r border-solid border-gray-400 pr-2"><span class="text-xs font-semibold pr-1 ">(2)</span>footer leffooter leftfooter leftfooter leftt 2</div> 
        <div class="text-xs border-r border-solid border-gray-400 pr-2"><span class="text-xs font-semibold pr-1 ">(3)</span>footer lefooter leftfooter leftfooter leftfooter leftft 3</div> 
        <div class="text-xs border-r border-solid border-gray-400 pr-2"><span class="text-xs font-semibold pr-1 ">(4)</span>footer lfooter leftfooter leftfooter lefteft 4</div> 
        <div class="text-xs border-r border-solid border-gray-400 pr-2"><span class="text-xs font-semibold pr-1 ">(5)</span>footer lfooter leftfooter leftfooter lefteft 5</div> 
        <div class="text-xs border-r border-solid border-gray-400 pr-2"><span class="text-xs font-semibold pr-1 ">(6)</span>footer lefooter leftfooter leftft 1</div> 
        <div class="text-xs border-r border-solid border-gray-400 pr-2"><span class="text-xs font-semibold pr-1 ">(7)</span>footer lefooter leftfooter leftfooter leftft 6</div> 
      </div>
      <div class="row-start-29 col-start-18 col-span-5 bg-rose-300 grid grid-cols-8"> 
        <div class="col-span-7 text-xs font-bold whitespace-nowrap px-2" >Company’s Financial Strength</div><div class="text-xs">A++</div>
        <div class="col-span-7 text-xs font-bold whitespace-nowrap px-2" > Stock’s Price Stability </div>   <div class="text-xs">70</div>
        <div class="col-span-7 text-xs font-bold whitespace-nowrap px-2" > Price Growth Persistence </div>  <div class="text-xs">60</div>
        <div class="col-span-7 text-xs font-bold whitespace-nowrap px-2" > Earnings Predictability </div>   <div class="text-xs">55</div>

      </div>
      <div class="row-start-30 col-span-17 bg-rose-300 flex flex-row text-xs"> 
        © 2022 Value Line, Inc. All rights reserved. Factual material is obtained from sources believed to be reliable and is provided without warranties of any kind.
        THE PUBLISHER IS NOT RESPONSIBLE FOR ANY ERRORS OR OMISSIONS HEREIN. This publication is strictly for subscriber’s own, non-commercial, internal use. No part
        of it may be reproduced, resold, stored or transmitted in any printed, electronic or other form, or used for generating or marketing any printed or electronic publication, service or product
      </div>

      <div class="row-start-30 col-start-18 col-span-5 bg-black text-white font-bold whitespace-nowrap px-2"> 
        To subscribe call 1-800-VALUELINE
      </div>
    </div>    
  </div>
</div>

